<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<meta http-equiv="content-type" content="text/html; charset=utf-8" />
		<link rel="shortcut icon" type="image/ico" href="http://www.datatables.net/media/images/favicon.ico" />
		
		<title>DataTables example</title>
		<style type="text/css" title="currentStyle">
			@import "<?php echo base_url()?>templates/css/demo_page.css";
			@import "<?php echo base_url()?>templates/css/demo_table.css";
			@import "<?php echo base_url()?>templates/css/jquery-ui.css";
			@import "<?php echo base_url()?>templates/css/demo_table_jui.css";			
			@import "<?php echo base_url()?>templates/css/jquery-ui-1.7.2.custom.css";
			@import "<?php echo base_url()?>templates/css/jsDatePick_ltr.css";
		</style>
		
        <script src="<?php echo base_url()?>templates/js/jquery.DataTables.min.js" type="text/javascript"></script>
        <script src="<?php echo base_url()?>templates/js/jquery.jeditable.js" type="text/javascript"></script>
        <script src="<?php echo base_url()?>templates/js/jquery-ui.js" type="text/javascript"></script>
        <script src="<?php echo base_url()?>templates/js/jquery.validate.js" type="text/javascript"></script>
        <script src="<?php echo base_url()?>templates/js/jquery.DataTables.editable.js" type="text/javascript"></script>		
        <script src="<?php echo base_url()?>templates/js/jquery.validate.js" type="text/javascript"></script>
        <script src="<?php echo base_url()?>templates/js/jquery.DataTables.editable.js" type="text/javascript"></script>
        <script type="text/javascript" language="javascript" src="<?php echo base_url()?>templates/js/jsDatePick.min.1.3.js"></script>
		<script type="text/javascript" language="javascript" src="<?php echo base_url()?>templates/js/jquery.js"></script>
		<script type="text/javascript" language="javascript" src="<?php echo base_url()?>templates/js/myjs.js"></script>
		<script type="text/javascript" language="javascript" src="<?php echo base_url()?>templates/js/jquery.dataTables.js"></script>
		<script type="text/javascript" charset="utf-8">
			$(document).ready(function() {
				    $('#example').dataTable( {
				        "bProcessing": true,
				        "bJQueryUI": true,
				        "sAjaxSource": '<?php echo base_url()?>datatable/danhsach',
				        "bStateSave": true	,
				         "sPaginationType": "full_numbers",
				          "sScrollX": "100%",
        				"sScrollXInner": "110%",        				       
        				"bScrollCollapse": true   				 
        				 
			        			        
				    } )
				} );
			
						 
				
		</script>
	</head>
	<body id="dt_example">
		<div id="container">
					
			
			<h1><?php echo base_url();?></h1>
			<div id="dynamic">
			
<table cellpadding="0" cellspacing="0" border="0" class="display" id="example">
	<thead>
		<tr>
			<th width="10%">WorkDay_ID</th>
			<th width="10%">Staff_ID</th>
			<th width="20%">Date</th>
			<th width="20%">StartTime</th>
			<th width="20%">EndTime</th>
			<th width="20%">FullName</th>
			
			
			
		</tr>
	</thead>
	<tbody>
		<tr>
			<td colspan="5" class="dataTables_empty">Loading data from server</td>
		</tr>
	</tbody>
	<tfoot>
		<tr>
			<th >WorkDay_ID</th>
			<th >Staff_ID</th>
			<th >Date</th>
			<th >StartTime</th>
			<th >EndTime</th>
			<th >FullName</th>
			
		</tr>
		
	</tfoot>
	
</table>	
<?php
	
?>		

		<input type="text" id="Date" name="Date" onclick="loadCalendar();" />
	
		<input type="submit" id="submitdate" name="submit"  />
	
	
			

<script type="text/javascript">
	

</script>
			
			
		</div>
	</body>
</html>